Page({
  data: {
    value: '', // 搜索框的值
    bannerList: [
      { imgUrl: '/images/images/petBanner-1.png' },
      { imgUrl: '/images/images/轮播图.png' },
    ],
    categoryList: [
      { id: 1, path: '/images/images/上门洗护.png', text: '上门洗护', link: '/pages/category/category?id=1' },
      { id: 2, path: '/images/images/上门喂养.png', text: '上门喂养', link: '/pages/category/category?id=2' },
      { id: 3, path: '/images/images/家庭清洁.png', text: '家庭清洁', link: '/pages/category/category?id=1'},
      { id: 4, path: '/images/images/餐食定制.png', text: '餐食定制', link: '/pages/category/category?id=1' },
    ],
    news: [
      {
        title: '最新动态',
        items1: [
          '北京大兴区法斗线下见面活动火热报名中！'
        ],
        items2: [
          '用户xxx成功领养猫咪一只，时间18:00'
        ],
        items3: [
          '用户xxx成功领养猫咪一只，时间18:00'
        ]
      }
    ],
    currentProvince: '北京市',
    currentCity: '东城区',
    provinces: ['北京市', '上海市', '广州市'],
    cities: {
      '北京市': ['东城区', '西城区', '朝阳区'],
      '上海市': ['黄浦区', '徐汇区', '长宁区'],
      '广州市': ['越秀区', '海珠区', '荔湾区']
    },
    scrollLeft: 0 // 控制滚动位置的数据
  },

  onLoad: function(options) {
    this.startScroll(); // 页面加载时启动滚动
    // 这里不需要再调用 fetchCategoryData 方法，因为你已经在 navigator 中处理了跳转
  },
  fetchCategoryData(categoryId) {
    // 这里应该是调用API获取数据的逻辑
    // 假设你有一个函数用来获取分类数据
  },
  // 开始滚动的函数
  startScroll() {
    const that = this;
    const speed = 50; // 滚动速度，数值越小速度越慢
    const noticeBarWidth = 300; // 滚动通告栏的宽度，根据实际宽度设置
    const interval = setInterval(() => {
      let currentScrollLeft = that.data.scrollLeft;
      currentScrollLeft -= speed;
      if (currentScrollLeft <= -this.getScrollTextWidth() + noticeBarWidth) {
        currentScrollLeft = noticeBarWidth;
      }

      that.setData({
        scrollLeft: currentScrollLeft
      });
    }, 50); // 每50毫秒滚动一次

    // 监听页面卸载，清除定时器
    this.onUnload(() => {
      clearInterval(interval);
    });
  },

  // 获取滚动文本宽度的函数
  getScrollTextWidth() {
    // const query = wx.createSelectorQuery().in(this);
    // query.select('.notice-text').boundingClientRect(rect => {
    //   if (rect) {
    //     console.log(rect.width);
    //     return rect.width;
    //   }
    // }).exec();
  },

  onLocationPickerTap() {
    wx.showModal({
      title: '变更地区',
      content: '点击选择新的地区',
      success: (res) => {
        if (res.confirm) {
          console.log('用户点击确定');
        } else if (res.cancel) {
          console.log('用户点击取消');
        }
      }
    });
    wx.showActionSheet({
      itemList: this.data.provinces,
      success: (res) => {
        if (res.tapIndex >= 0) {
          const selectedProvince = this.data.provinces[res.tapIndex];
          const selectedCities = this.data.cities[selectedProvince];
          wx.showActionSheet({
            itemList: selectedCities,
            success: (cityRes) => {
              if (cityRes.tapIndex >= 0) {
                const selectedCity = selectedCities[cityRes.tapIndex];
                this.setData({
                  currentProvince: selectedProvince,
                  currentCity: selectedCity
                });
              }
            }
          });
        }
      }
    });
  },

  onChange(event) {
    // 输入内容变化时的处理函数
    this.setData({
      value: event.detail.value
    });
  },

  onSearch(event) {
    // 执行搜索操作的处理函数
    console.log('搜索关键词:', this.data.value);
    // 在这里添加搜索逻辑，例如跳转到搜索结果页面或调用API获取数据
  },

  onServiceProcessTap() {
    // 服务流程点击事件处理函数
    console.log('服务流程被点击');
    wx.showModal({
      title: '服务流程',
      content: '1. 填写待服务宠物档案\n2. 选择服务项目\n3. 预约服务时间\n4. 等待专业人员上门',
      showCancel: false
    });
  },

  onServiceCommitmentTap() {
    // 服务承诺点击事件处理函数
    console.log('服务承诺被点击');
    wx.showModal({
      title: '服务承诺',
      content: '1. 宠托师保障\n2. 全程可监控\n3. 随时可沟通',
      showCancel: false
    });
  }
});